<template>
	<zw-dialog :hidden="hidden" title="设置服务有礼比例" :width="450" :height="100" :showHeaderBg="false" :hideFooter="false"
	 :showFooterBg="false" borderRadius @close="closeDialog" @cancel="closeDialog" @confirm="submit">
		<view class="form-wrap" @keydown.enter="submit">
			<view class="wrap">
				<u-slider style="cursor: pointer;" v-model="value" :step="step" :min="min" :max="max" active-color='#e93323' block-width='50' height='20' block-color='#c6c6c6'></u-slider>
			</view>
			<view class="showText"><text>当前比例 {{Number(value / num)}}</text></view>
		</view>
	</zw-dialog>
</template>

<script>
	export default {
		props: {
			hidden: true
		},
		data() {
			return {
				userInfo:{},
				value:1,
				min:0,
				max:0,
				num:1,
				step:0.01
			}
		},
		created() {
			this.getSelfInfo()
		},
		methods: {
			getRandom() {
				this.random = this.$util.getRandomStr();
			},
			closeDialog() {
				this.$emit('update:hidden', true);
			},
			getSelfInfo() {
				uni.showLoading({
					title:'加载中'
				})
				this.uni_request({
					url: '/user/info',
					method: 'GET',
					success: (res) => {
						uni.hideLoading()
						if (res.data.code == 0 || res.data.code == 200) {
							this.userInfo  = res.data.data
							// this.getProfit()
						} else {
							uni.hideLoading()
							uni.showToast({
								title: res.data.msg,
								icon: "none"
							})
							
						}
					},
					
				})
			},
			getProfit() {
				this.uni_request({
					url: '/user/userInfo/serveProfitPercentRange',
					method: 'GET',
					success: (res) => {
						if (res.data.code == 0 || res.data.code == 200) {
							uni.hideLoading()
							this.num = Number(100 / res.data.data.dictValue2)
							this.max = Number(res.data.data.dictValue2*this.num)
							this.min = Number(res.data.data.dictValue*this.num)
							this.step = Number(this.num*this.step)
							if(this.userInfo.serveProfitPercent){
								this.value = Number(this.userInfo.serveProfitPercent *this.num)
							}else{
								this.value = Number(this.min)
							}
						} else {
							
							uni.showToast({
								title: res.data.msg,
								icon: "none"
							})
						}
					}
				})
			},
			
			
			submit() {
				this.$emit('change', Number(this.value / this.num));
				
				
			},
			
		}
	}
</script>

<style lang="scss">
	.showText{
		width: 100%;
		display: flex;justify-content: center;margin-top: 20px;font-size: 16px;
		text{background: #e93323;color: #fff;padding: 6px;border-radius: 5px;}
	}
	.form-wrap {
		width: 100%;
		margin: 0 20px;
		padding: 30px 10px 0 10px;
		border-top: 1px solid $border-color;

		.form-item-title {
			font-size: 15px;
			color: #555;
			font-weight: bold;
			line-height: 30px;
		}

		.form-item {
			@extend %flex-align-center;
			margin-bottom: 10px;
			input {
				flex: 1;
				height: 40px;
				line-height: 40px;
				padding: 0 10px;
				color: #333;
				border: 1px solid #e8e8e8;
			}

			.phone_right {
				width: 85px;
				height: 42px;
				line-height:42px;
				margin-left: 15px;
				cursor: pointer;
			}
			.phone_right:hover{
				color: #e93323;
			}
		}
	}
</style>
